<template>
	<view class="login">
		<view class="header">
			<image mode="aspectFit" class="bg" :src="resBaseUrl+'login/bg.png'" alt="">
				<image mode="aspectFit" class="logo" :src="resBaseUrl+'login/logo.png'" alt="">
		</view>
		<view class="form">
			<view class="username">
				<view>
					账号:
				</view>
				<input v-model="username" type="text" placeholder="请输入账号/手机号">
			</view>
			<view>
				<view>
					密码:
				</view>
				<view style="	margin-top: 20rpx;
				background-color: #F2F2F2;
				height: 94rpx;
				border-radius: 48rpx;
				" class="password">
					<input style="border: none;height: 100%;background-color: transparent;border: 0;
outline: none;" v-model="password" :type="!passwordType?'password':'text'" placeholder="请输入密码">
					<image mode="aspectFit" style="z-index: 999;" @tap="passwordType=!passwordType"
						:src="resBaseUrl+( passwordType?'login/see.png':'login/nosee.png') "></image>
				</view>
			</view>

		</view>
		<view class="auto">
			<view @tap="knowFlag=!knowFlag">
				<image mode="aspectFit" :src="resBaseUrl+(knowFlag?'login/yuan.png':'login/kongyuan.png')" alt="">
					记住密码
			</view>
			<view @tap="autoFlag=!autoFlag">
				<image mode="aspectFit" :src="resBaseUrl+(autoFlag?'login/yuan.png':'login/kongyuan.png')" alt="">
					自动登录
			</view>
		</view>
		<view class="btn">
			<view @tap="login">登&emsp;录</view>
		</view>
		<view @tap="logon" class="logon">
			注册
		</view>
		<view class="know">
			登录即视为您已经阅读并同意</br>
			<text @tap="skip('/pages/login/userAgreement')">《用户注册协议》</text>和<text
				@tap="skip('/pages/login/Privacy')">《隐私政策》</text>
		</view>
	</view>
</template>

<script>
	var app = getApp();
	export default {
		data() {
			const _this = this
			return {
				resBaseUrl: _this.resBaseUrl,
				// 账号
				username: "",
				// 密码
				password: "",
				// 看密码
				passwordType: false,
				// 自动登录
				autoFlag: false,
				// 记住密码
				knowFlag: false
			}
		},
		methods: {
			// 前往注册
			logon() {
				uni.navigateTo({
					url: "/pages/Registration/index"
				})
			},
			// 登录
			login() {
				// console.log(this.knowFlag);
				if (this.username == '' || this.password == '') {
					uni.showToast({
						title: "请填写账号或密码",
						icon: "none"
					})
				} else {
					if (this.knowFlag) {
						uni.setStorageSync('know', {
							knowFlag: this.knowFlag,
							username: this.username,
							password: this.password
						})
					}
					if (this.autoFlag) {
						uni.setStorageSync('auto', this.autoFlag)
					}
					this.$api.loginApi({
						userLoginId: this.username,
						userPassword: this.password
					}).then(async res => {
						// console.log(res)
						if (res.code == 200) {
							uni.setStorageSync('printConfig',res.result.printConfig)
							let appVersion = await this.$api.initApi();
							// console.log('appVersion'+res.result.printConfig);
							app.globalData.versionInfo = appVersion.result;
							// console.log(appVersion.result);
							// this.$store.commit("saveAppVersion", appVersion.result.appVersion)
							// uni.setStorageSync("saveAppVersion", appVersion.result)
							// console.log(res);
							//#ifdef APP-PLUS
							// console.log(plus.runtime.version);
							// app.globalData.localVersion['version'] = plus.runtime.version
							// uni.setStorageSync('appVersion', plus.runtime.version)
							//#endif
							if (res.result.sessionToken) {
								// appVersion
								uni.setStorageSync("token", res.result.sessionToken)
								// uni.setStorageSync("userInfo", res.result)
								app.globalData.userInfo = res.result;
								// console.log(app.globalData.userInfo);
								// if (app.globalData.BLEInformation.deviceId == "") {
								// 	uni.showModal({
								// 		title: "系统提示！",
								// 		content: "尚未设置蓝牙打印，是否设置？",
								// 		success: (res) => {
								// 			if (res.confirm) {
												
								// 				uni.switchTab({
								// 					url: "/pages/index/index"
								// 				})
								// 				setTimeout(()=>{
								// 					uni.navigateTo({
								// 						url: "/pages/setup/Bluetooth",
								// 					});
								// 				},300)
												

								// 			} else {
								// 				uni.switchTab({
								// 					url: "/pages/index/index"
								// 				})
								// 			}
								// 		}
								// 	})

								// 	return
								// }
								uni.switchTab({
									url: "/pages/index/index"
								})


							} else {
								// uni.showToast({
								// 	title: res.message,
								// 	icon:'none'
								// })
							}

						}
					})

				}
			},
		},
		onShow() {

			// console.log(uni.getStorageSync('auto') && uni.getStorageSync('know'));
			if (uni.getStorageSync('auto') && uni.getStorageSync('know')) {
				this.username = uni.getStorageSync("know").username
				this.password = uni.getStorageSync("know").password
				this.login()
			} else if (uni.getStorageSync('know')) {
				this.username = uni.getStorageSync("know").username
				this.password = uni.getStorageSync("know").password
				this.knowFlag = uni.getStorageSync("know").knowFlag

			}
		}
	}
</script>

<style scoped lang="scss">
	page {
		background: #fff;
	}

	.login {
		background: #fff;
		height: 100vh;

		.header {
			position: relative;
			height: 366rpx;
			width: 750rpx;

			.bg {
				width: 100%;
				height: 100%;
				transform: scale(1.7);
				margin-top: -65rpx;
			}

			.logo {
				position: absolute;
				z-index: 999;
				top: 78rpx;
				left: 270rpx;
				width: 216rpx;
				height: 172rpx;

			}
		}

		.form {
			// color: #BDBDBD;
			// background-color: #dac;
			padding: 120rpx 110rpx 28rpx 110rpx;
			box-sizing: border-box;
			/* #ifndef MP-WEIXIN */
			text-indent: 1em;
			/* #endif */


			.username {
				margin-bottom: 60rpx;
			}

			.password {
				position: relative;
				/* #ifndef MP-WEIXIN */
				text-indent: 1em;
				/* #endif */

				image {
					position: absolute;
					right: 20rpx;
					top: 35rpx;
					width: 50rpx;
					height: 30rpx;

				}

				// background-color: #fac;

				// input {
				// 	margin-top: 20rpx;
				// 	height: 94rpx;
				// 	border-radius: 48rpx;
				// 	text-indent: 1em;
				// }
			}

			input {
				margin-top: 20rpx;
				background-color: #F2F2F2;
				height: 94rpx;
				border-radius: 48rpx;
				/* #ifndef MP-WEIXIN */
				text-indent: 1em;
				/* #endif */
				/* #ifdef MP-WEIXIN */
				padding: 0 1em;
				/* #endif */
			}
		}

		.auto {
			display: flex;
			width: 63%;
			margin: auto;
			justify-content: space-between;

			view {
				display: flex;
				align-items: center;

				image {
					width: 26rpx;
					height: 26rpx;
					margin-right: 10rpx;
				}
			}
		}

		.btn {
			margin-top: 56rpx;

			view {
				background-image: url("/static/images/login/button.png");
				background-size: 390rpx 124rpx;
				width: 390rpx;
				height: 124rpx;
				line-height: 100rpx;
				color: #fff;
				text-align: center;
				margin: auto;
			}
		}

		.logon {
			text-align: center;
			height: 16rpx;
			font-size: 40rpx;
			text-decoration: underline;
			color: #A2A2A2;
			margin-top: 36rpx;
		}

		.know {
			width: 80%;
			margin: 50rpx auto;
			text-align: center;
			color: #ccc;
			line-height: 1.5;

			text {
				text-decoration: underline;
			}
		}
	}
</style>